/*
 * @Author: kk kk@g.com
 * @Date: 2023-01-04 19:33:18
 * @LastEditors: kk kk@g.com
 * @LastEditTime: 2023-01-07 17:10:47
 * @FilePath: \aone-admin\aoneui\components\Dialog\index.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import Vue from 'vue'
import { merge, emit } from 'lodash'
import Dialog from './dialog.vue'
const insConstructor = Vue.extend(Dialog)
const create = function (options) {
    options = options || {} // 获取参数
    const { created, mounted } = options
    delete options.created
    delete options.mounted
    const divParent = document.createElement('div')
    /* 添加节点 */
    document.body.appendChild(divParent)// 需要这样处理，不然mounted钩子里面取不到dom结构
    const mount = new insConstructor(merge({
        computed: {
            dialogOptions() {
                return {
                    columns: []
                }
            }
        }
    }, options, {
        methods: {
            closeAndDestroy() {
                destroy(mount)
            },
        },
        // 确保created执行时，formData已初始化完毕
        created() {
            this.$nextTick(() => {
                created && created.bind(this)()
            })
        },
        // 确保mounted执行时，formData已初始化完毕
        mounted() {
            this.$nextTick(() => {
                mounted && mounted.bind(this)()
            })
        },
    })).$mount(divParent)
    return mount
}
/**
 * 用create返回mount销毁弹窗
 * @param {*} mount 
 */
const destroy = function (mount) {
    mount.formOptions.columns.forEach(column => {
        // 内部组件可能有自己的销毁事件，比如tinyme
        column.destroy?.()
    })
    mount.$destroy()
    mount.$off()
    mount.$el.parentNode?.removeChild?.(mount.$el)
}


const createTable = function (options) {
    const dialogOptions = options.computed.dialogOptions
    delete options.computed.dialogOptions
    const dialogOptionsResult = dialogOptions.bind(this)()
    create(merge({
        computed: {
            dialogOptions() {
                return {
                    title: dialogOptionsResult.title,
                    cancel: dialogOptionsResult.cancel || false,
                    submit: dialogOptionsResult.submit || false,
                    reject: dialogOptionsResult.reject || false,
                    columns: [
                        {
                            comtype: "vnode",
                            labelWidth: 0,
                            render: function () {
                                const that = this
                                // 弹窗内表格
                                return this.createTable({
                                    computed: {
                                        tableOptions: dialogOptions.bind(that)
                                    },
                                });
                            },
                        },
                    ],
                };
            },
        },
    }, options));
}

export default {
    create,
    createTable,
    destroy
}